<template>
	<view>
		<!-- <u-popup :show="isShow" mode="center">
			<view>
				<view class='auth-header'>
					<view class="image">
						<open-data type="userAvatarUrl"></open-data>
					</view>
				</view>
				<view class='title'>授权提醒</view>
				<view class='tip'>请授权头像等信息，以便为您提供更好的服务</view>
				<view class='bottom acea-row'>
					<view class='item' @click='close'>随便逛逛</view>
					<button class='item grant' type="primary" lang="zh_CN" open-type="getUserInfo"
						withCredentials="true" @click="login"> 去授权登录 </button>
				</view>
			</view>
		</u-popup> -->
	</view>
</template>

<script>
	import store from '@/store'
	let app = getApp();
	export default {
		name: "login",
		props: {
			// isShow: {
			// 	type: Boolean,
			// 	default: false
			// },
			isAuto: {
				type: Boolean,
				default: false
			},
		},
		data() {
			return {
				// isShow: false,
				code: '', //微信临时登录凭证
				Info: '',
				invite_code: '',
				openid: '',
			};
		},
		created() {
			if (this.isAuto) {
				this.checkSession()
			}

		},

		methods: {
			close() {
				// this.isShow = false
				this.$emit("close")
				uni.showToast({
					title: '您拒绝了请求,不能正常使用小程序',
					icon: 'error',
					duration: 2000
				});
			},
			checkSession() {
				//检查登录态是否过期
				var that = this;
				const openid = uni.getStorageSync('openid');
				uni.checkSession({
					provider: 'weixin',
					success: function(loginRes) {
						if (!openid) {
							// that.$emit("chamgs")
							that.login();
						}
					},
					fail: function(loginRes) {
						console.log('checkSession失败', loginRes);
						// that.$emit("chamgs")
						that.login();
					},
				});

			},
			login() {
				var that = this;
				uni.login({
					provider: 'weixin',
					success: function(loginRes) {
						that.code = loginRes.code
						console.log('login', loginRes)
						that.getOpenid()
					},
					fail: function(loginRes) {
						console.log(loginRes)
					}
				});

				// 获取用户信息
				// uni.getUserProfile({
				// 	desc: '获取你的昵称、头像、地区及性别',
				// 	success: res => {
				// 		console.log('获取你的昵称、头像', res);
				// 		this.Info = res;

				// 		uni.setStorageSync('userInfo', res)
				// 		// store.commit('saveUserinfoDetails', res)
				// 	},
				// 	fail: res => {
				// 		console.log(2);
				// 		console.log(res)
				// 		//拒绝授权
				// 		uni.showToast({
				// 			title: '您拒绝了请求,不能正常使用小程序',
				// 			icon: 'error',
				// 			duration: 2000
				// 		});
				// 		return;
				// 	}
				// });
			},
			// 微信授权 获得openid
			async getOpenid() {
				var that = this;
				const res = await this.$myRequest({
					url: '/api/login/getOpenids', //把接口传过去
					data: {
						code: this.code,
					}
				})
				console.log('微信授权', res)
				var sessionKey = res.data.data.sessionKey;
				var openid = res.data.data.openid;

				uni.setStorageSync('sessionKey', sessionKey)
				uni.setStorageSync('openid', openid)
				// store.commit('login', res.data.data.openid)
				that.$emit("phone_show")
			},


			//获取用户的当前设置
			getSetting() {
				return new Promise(function(resolve, reject) {
					uni.getSetting({
						success: function(res) {
							if (res.authSetting['scope.userInfo']) {
								console.log('存在');
								resolve(true);
							} else {
								console.log('不存在');
								resolve(false);
							}
						}
					})
				}).catch((e) => {
					console.log(e)
				});;
			},
		}


	}
</script>

<style lang="scss" scoped>
	.auth-header {
		border-bottom: 1px solid #eee;
		text-align: center;
		padding: 50rpx 0 35rpx;
		margin: 0 20rpx;
	}

	.auth-header .image {
		width: 160rpx;
		height: 160rpx;
		border-radius: 50%;
		display: inline-block;
		overflow: hidden;
	}

	image {
		width: 150rpx;
		height: 150rpx;
		margin: -67rpx auto 0 auto;
		display: block;
		border: 8rpx solid #fff;
		border-radius: 50%
	}

	.title {
		font-size: 28rpx;
		color: #000;
		text-align: center;
		margin-top: 30rpx
	}

	.tip {
		font-size: 22rpx;
		color: #555;
		padding: 0 24rpx;
		margin-top: 25rpx;
	}

	.bottom .item {
		width: 50%;
		height: 80rpx;
		background-color: #eeeeee;
		text-align: center;
		line-height: 80rpx;
		font-size: 24rpx;
		color: #666;
		margin-top: 54rpx;
	}

	.bottom .item.on {
		width: 100%
	}

	.bottom .item.grant {
		font-size: 28rpx;
		color: #fff;
		font-weight: bold;
		background-color: #347DFE;
		border-radius: 0;
		padding: 0;
	}

	.mask {
		position: fixed;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0.65);
		z-index: 310;
	}
</style>
